import { observable, action, computed, reaction } from "mobx"
import { network } from "@/utils/network";
import Taro from '@tarojs/taro'
import { IGood, SideBarItem, Good } from "./declare"
import { CartModelCustomer } from "./CartHooksCustomer";

/**
 * 分类数据模型定义
 */


type Category = {
    name: string
    id: number
    num?: string
}
class CategoryGoodsModel extends CartModelCustomer {

    @observable.ref
    categorys: Category[]

    @observable.ref
    current?: Category

    @observable.ref
    goods: IGood[]

    @observable
    loading: boolean


    @observable
    isLogin: boolean

    constructor() {
        super()
        this.categorys = []
        this.current = this.categorys[0]
        // 默认给4个 skeleton
        this.goods = Array.from({ length: 4 })
        this.initialize()
        this.loading = true
        this.isLogin = false
    }

    @action
    setValue(cates: Category[], goods: IGood[]) {
        this.categorys = cates
        this.goods = goods
    }

    @action
    setCurrent(current: any) {
        this.current = current
    }


    @computed
    get model(): { items: SideBarItem[], activeKey: string, goods: IGood[] } {
        return {
            items: this.categorys.map(it => {
                return {
                    title: it.name,
                    dot: false,
                    info: it.num,
                    id: `${it.id}`,
                    disabled: false
                }
            }),
            activeKey: this.current ? `${this.current.id}` : '',
            goods: this.goods
        }
    }



    async getData(id: string) {
        this.loading = true
        Taro.showLoading({ title: '加载中' });

        this.isLogin = !!Taro.getStorageSync('user_id');
        try {
            const { code, data } = await network.get('/xxm/category/list');
            if (code === 0 && data) {
                this.setValue(data, []);
                const current = id ? { id } : data[0];
                this.setCurrent(current);
            }
        } catch (e) {
        } finally {
            Taro.hideLoading()
        }
    }


    initialize() {

        reaction(() => this.current, (current: Category) => {
            if (current) {
                // 根据分类 获取商品信息
                Taro.showLoading({ title: 'loading..' })
                network.get(`/xxm/category/goods/${current.id}`).then(res => {
                    const { data: { list = [] } } = res;
                    this.setValue(this.categorys, list.map(good => {
                        const gl = good as IGood
                        const it = new Good(
                            gl.id,
                            gl.name,
                            gl.nick,
                            gl.brief,
                            gl.price,
                            gl.cost_price,
                            gl.main_pic,
                            gl.market_price,
                            gl.dis,
                            this.getGoodNum(gl.id)
                        )
                        this.goodsMap.set(`${it.id}`, it)
                        return it
                    }));
                    Taro.hideLoading()
                    this.loading = false;
                }).catch(() => {
                    Taro.hideLoading()
                    this.loading = false;
                })
            }
        })
    }


}

export const categoryGoodsModel = new CategoryGoodsModel()